<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo2</title>
<script type="text/javascript">
	var context;
	window.onload = function(){
		//得到画布
		var canvas1 = document.getElementById("tt");
		canvas1.width=1000;
		canvas1.height=800;
		//得到绘图上下文(你可以理解是画笔)
		context = canvas1.getContext("2d");
		//给坐标x,y加水平的和垂直的偏移
		context.translate(300,300);
		//设置透明度0-1
		context.globalAlpha = 0.8;
		move();
	}
	function move() {
		context.translate(75,75);
		for (var i=1;i<6;i++){
			context.save();
			context.fillStyle = 'rgb('+(51*i)+','+(255-51*i)+',255)';
			for (var j=0;j<i*6;j++){
				context.rotate(Math.PI*2/(i*6));
				context.beginPath();
				context.arc(0,i*12.5,5,0,Math.PI*2,true);
				context.fill();
// 				context.scale(1.1,1.1);
			}
			context.restore();
		}
	}
</script>

</head>
<body>
<canvas id="tt" style=""></canvas>
<a id="aa"></a>
</body>
</html>